<template>
  <el-image :src="imgUrl" v-bind="config" :preview-src-list="previewSrcList?[imgUrl]:undefined" @error="$emit('error', $event)" @load="$emit('load', $event)">
    <template #placeholder>
      <slot name="placeholder" />
    </template>
    <template #error>
      <slot name="placeholder" />
    </template>
  </el-image>
</template>

<script>
export default {
  props: {
    src: {
      type: String,
      default: ''
    },
    previewSrcList: {
      type: Boolean,
      default: false
    },
    config: {
      type: Object,
      default() {
        return {
          fit: 'cover'
        }
      }
    }
  },
  computed: {
    imgUrl() {
      if (/http/.test(this.src)) {
        return this.src
      } else {
        return process.env.VUE_APP_IMG_BASE + this.src
      }
    }
  }
}
</script>

<style></style>
